import Vue from "vue";
import VueRouter from "vue-router";
import HomeView from "../views/HomeView.vue";

Vue.use(VueRouter);

// 版本1
// 哈哈哈我是dev分支的代码
// 演示冲突
const routes = [
    {
        path: "/",
        name: "home",
        component: HomeView
    },
    {
        path: "/myInfo",
        name: "myInfo",
        // webpack的魔法注释按模块分割资源
        component: () =>
            import(/* webpackChunkName: "myInfo" */ "../views/MyInfo.vue")
    },
    {
        path: "/myCar",
        name: "myCar",
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/MyCar.vue")
    },

    {
        path: "/componentMessage",
        name: "componentMessage",
        // webpack的魔法注释
        component: () =>
            import(
                /* webpackChunkName: "myCar" */ "../views/ComponentMessage.vue"
            )
    },

    {
        path: "/vuex/:name",
        name: "vuex",
        beforeEnter: (to, from, next) => {
            // reject the navigation
            next();
            return true;
        },
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/Vuex.vue")
        // beforeEnter: (to, from) => {
        //     // reject the navigation
        //     return true;
        // }
    },

    {
        path: "/routerLink",
        name: "routerLink",
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/routerLink.vue")
    },

    {
        path: "/mixin",
        name: "mixin",
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/mixins.vue")
    },
    {
        path: "/watch",
        name: "watch",
        // webpack的魔法注释
        component: () =>
            import(
                /* webpackChunkName: "myCar" */ "../views/watch_computed.vue"
            )
    },
    {
        path: "/slot",
        name: "slot",
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/slot.vue")
    },
    {
        path: "/keepalive",
        name: "keepalive",
        // webpack的魔法注释
        component: () =>
            import(/* webpackChunkName: "myCar" */ "../views/keepalive.vue")
    }
];

const router = new VueRouter({
    mode: "history",
    base: process.env.BASE_URL,
    routes
});
// // 路由跳转之前走这个全局的导航守卫
// router.beforeEach((to, from, next) => {
//     console.log("全局导航守卫");
//     next();
// });

// // 路由跳转完成之后走这个全局的导航守卫

// router.afterEach((to, from) => {});
export default router;
